<template>
  <div v-show="showtip" class="tip custom-block" @click="isShowtip">
    <p class="custom-block-title">{{ tipcontent.title }}</p>
    <p class="custom-block-memo" v-html="tipcontent.memo"></p>
  </div>
</template>

<script>
  export default defineComponent({
    name: 'TopTip',
    props: {
      tipcontent: {
        type: String,
        default: '',
      },
    },
    setup(props) {
      const state = reactive({
        showtip: true,
        tipcontent: props.tipcontent,
      })

      const isShowtip = () => {
        console.log('Showtip', state.showtip)
        state.showtip = !state.showtip
      }

      return {
        ...toRefs(state),
        isShowtip,
      }
    },
  })
</script>
